<template>
  <div class="layout">
    <clw-header></clw-header>
    <div class="layout_container">
      <clw-nav :navList="navList" v-if="hasNav"></clw-nav>
      <div class="layout_view" v-else>
        <router-view />
      </div>
    </div>
  </div>
</template>

<script>
// @ is an alias to /src
import ClwHeader from "@/components/ClwHeader";
import ClwNav from "@/components/ClwNav";
import { httpRequest } from "@/untils/httpRequest";

export default {
  name: "LayOut",
  components: { ClwNav, ClwHeader },
  data() {
    return {
      menu_list: JSON.parse(localStorage.getItem('menu_list')) ? JSON.parse(localStorage.getItem('menu_list')): [],
      user: [],
    };
  },
  methods: {
  },
  computed: {
    hasNav() {
      let has_nav =
        this.menu_list.length > 0 &&
        this.menu_list.filter((item) => {
          return this.$route.fullPath.includes(item.path);
        })[0];
      return has_nav && has_nav.children.length > 0;
    },
    navList() {
      return (
        this.menu_list.length > 0 &&
        this.menu_list.filter((item) => {
          return this.$route.path.includes(item.path);
        })[0].children
      );
    },
  },
  mounted() {
  },
};
</script>
<style lang="less">
.layout {
  width: 100%;
  height: 100%;

  .layout_container {
    width: 100%;
    height: calc(100% - 44px);
    display: flex;

    .layout_view {
      width: 100%;
      height: 100%;
      overflow: auto;
    }
  }
}
</style>
